<template name="skeleton">
  <view is="pages-order/list/components/OrderList">
    <scroll-view
      :enable-back-to-top="true"
      :refresher-enabled="true"
      :scroll-y="true"
      class="orders OrderList--orders"
    >
      <view class="card OrderList--card">
        <view class="status OrderList--status">
          <text class="date OrderList--date sk-transparent sk-text-14-2857-427 sk-text"
            >2025-07-30 02:36:35</text
          >
          <text class="sk-transparent sk-text-14-2857-650 sk-text">待发货</text>
        </view>
        <navigator class="goods OrderList--goods" hover-class="none">
          <view class="cover OrderList--cover">
            <image mode="aspectFit" class="sk-image"></image>
          </view>
          <view class="meta OrderList--meta">
            <view
              class="name OrderList--name ellipsis OrderList--ellipsis sk-transparent sk-text-14-2857-794 sk-text"
              >出差旅行必备神器，多国通用转换插头</view
            >
            <view class="type OrderList--type sk-transparent sk-text-22-2222-523 sk-text"
              >PD45W快充款</view
            >
          </view>
        </navigator>
        <view class="payment OrderList--payment">
          <text
            class="quantity OrderList--quantity sk-transparent sk-text-0-0000-176 sk-text"
            style="background-position-x: 100%"
            >共2件商品</text
          >
          <text
            class="sk-transparent sk-text-0-0000-562 sk-text"
            style="background-position-x: 100%"
            >实付</text
          >
          <text class="amount OrderList--amount sk-transparent"
            ><text class="symbol OrderList--symbol sk-transparent sk-opacity">¥</text>231</text
          >
        </view>
        <view class="action OrderList--action">
          <navigator class="sk-transparent sk-text-14-2857-737 sk-text" hover-class="none">
            再次购买
          </navigator>
        </view>
      </view>
      <view class="card OrderList--card">
        <view class="status OrderList--status">
          <text class="date OrderList--date sk-transparent sk-text-14-2857-777 sk-text"
            >2025-07-30 02:20:06</text
          >
          <text class="sk-transparent sk-text-14-2857-481 sk-text">待发货</text>
        </view>
        <navigator class="goods OrderList--goods" hover-class="none">
          <view class="cover OrderList--cover">
            <image mode="aspectFit" class="sk-image"></image>
          </view>
          <view class="meta OrderList--meta">
            <view
              class="name OrderList--name ellipsis OrderList--ellipsis sk-transparent sk-text-14-2857-95 sk-text"
              >出差旅行必备神器，多国通用转换插头</view
            >
            <view class="type OrderList--type sk-transparent sk-text-22-2222-69 sk-text"
              >PD45W快充款</view
            >
          </view>
        </navigator>
        <view class="payment OrderList--payment">
          <text
            class="quantity OrderList--quantity sk-transparent sk-text-0-0000-519 sk-text"
            style="background-position-x: 100%"
            >共2件商品</text
          >
          <text class="sk-transparent sk-text-0-0000-76 sk-text" style="background-position-x: 100%"
            >实付</text
          >
          <text class="amount OrderList--amount sk-transparent"
            ><text class="symbol OrderList--symbol sk-transparent sk-opacity">¥</text>231</text
          >
        </view>
        <view class="action OrderList--action">
          <navigator class="sk-transparent sk-text-14-2857-365 sk-text" hover-class="none">
            再次购买
          </navigator>
        </view>
      </view>
      <view class="card OrderList--card">
        <view class="status OrderList--status">
          <text class="date OrderList--date sk-transparent sk-text-14-2857-89 sk-text"
            >2025-07-30 02:16:57</text
          >
          <text class="sk-transparent sk-text-14-2857-549 sk-text">待发货</text>
        </view>
        <navigator class="goods OrderList--goods" hover-class="none">
          <view class="cover OrderList--cover">
            <image mode="aspectFit" class="sk-image"></image>
          </view>
          <view class="meta OrderList--meta">
            <view
              class="name OrderList--name ellipsis OrderList--ellipsis sk-transparent sk-text-14-2857-765 sk-text"
              >出差旅行必备神器，多国通用转换插头</view
            >
            <view class="type OrderList--type sk-transparent sk-text-22-2222-349 sk-text"
              >PD45W快充款</view
            >
          </view>
        </navigator>
      </view>
    </scroll-view>
  </view>
</template>

<style>
.sk-transparent {
  color: transparent !important;
}
.sk-text-26-6667-873 {
  background-image: linear-gradient(
    transparent 26.6667%,
    #eeeeee 0%,
    #eeeeee 73.3333%,
    transparent 0%
  ) !important;
  background-size: 100% 60rpx;
  position: relative !important;
}
.sk-text {
  background-origin: content-box !important;
  background-clip: content-box !important;
  background-color: transparent !important;
  color: transparent !important;
  background-repeat: repeat-y !important;
}
.sk-text-26-6667-60 {
  background-image: linear-gradient(
    transparent 26.6667%,
    #eeeeee 0%,
    #eeeeee 73.3333%,
    transparent 0%
  ) !important;
  background-size: 100% 60rpx;
  position: relative !important;
}
.sk-text-26-6667-45 {
  background-image: linear-gradient(
    transparent 26.6667%,
    #eeeeee 0%,
    #eeeeee 73.3333%,
    transparent 0%
  ) !important;
  background-size: 100% 60rpx;
  position: relative !important;
}
.sk-text-26-6667-343 {
  background-image: linear-gradient(
    transparent 26.6667%,
    #eeeeee 0%,
    #eeeeee 73.3333%,
    transparent 0%
  ) !important;
  background-size: 100% 60rpx;
  position: relative !important;
}
.sk-text-26-6667-328 {
  background-image: linear-gradient(
    transparent 26.6667%,
    #eeeeee 0%,
    #eeeeee 73.3333%,
    transparent 0%
  ) !important;
  background-size: 100% 60rpx;
  position: relative !important;
}
.sk-text-14-2857-427 {
  background-image: linear-gradient(
    transparent 14.2857%,
    #eeeeee 0%,
    #eeeeee 85.7143%,
    transparent 0%
  ) !important;
  background-size: 100% 39.2rpx;
  position: relative !important;
}
.sk-text-14-2857-650 {
  background-image: linear-gradient(
    transparent 14.2857%,
    #eeeeee 0%,
    #eeeeee 85.7143%,
    transparent 0%
  ) !important;
  background-size: 100% 39.2rpx;
  position: relative !important;
}
.sk-text-14-2857-794 {
  background-image: linear-gradient(
    transparent 14.2857%,
    #eeeeee 0%,
    #eeeeee 85.7143%,
    transparent 0%
  ) !important;
  background-size: 100% 36.4rpx;
  position: relative !important;
}
.sk-text-22-2222-523 {
  background-image: linear-gradient(
    transparent 22.2222%,
    #eeeeee 0%,
    #eeeeee 77.7778%,
    transparent 0%
  ) !important;
  background-size: 100% 43.2rpx;
  position: relative !important;
}
.sk-text-0-0000-176 {
  background-image: linear-gradient(
    transparent 0%,
    #eeeeee 0%,
    #eeeeee 100%,
    transparent 0%
  ) !important;
  background-size: 100% 24rpx;
  position: relative !important;
}
.sk-text-0-0000-562 {
  background-image: linear-gradient(
    transparent 0%,
    #eeeeee 0%,
    #eeeeee 100%,
    transparent 0%
  ) !important;
  background-size: 100% 28rpx;
  position: relative !important;
}
.sk-opacity {
  opacity: 0 !important;
}
.sk-text-14-2857-737 {
  background-image: linear-gradient(
    transparent 14.2857%,
    #eeeeee 0%,
    #eeeeee 85.7143%,
    transparent 0%
  ) !important;
  background-size: 100% 36.4rpx;
  position: relative !important;
}
.sk-text-14-2857-777 {
  background-image: linear-gradient(
    transparent 14.2857%,
    #eeeeee 0%,
    #eeeeee 85.7143%,
    transparent 0%
  ) !important;
  background-size: 100% 39.2rpx;
  position: relative !important;
}
.sk-text-14-2857-481 {
  background-image: linear-gradient(
    transparent 14.2857%,
    #eeeeee 0%,
    #eeeeee 85.7143%,
    transparent 0%
  ) !important;
  background-size: 100% 39.2rpx;
  position: relative !important;
}
.sk-text-14-2857-95 {
  background-image: linear-gradient(
    transparent 14.2857%,
    #eeeeee 0%,
    #eeeeee 85.7143%,
    transparent 0%
  ) !important;
  background-size: 100% 36.4rpx;
  position: relative !important;
}
.sk-text-22-2222-69 {
  background-image: linear-gradient(
    transparent 22.2222%,
    #eeeeee 0%,
    #eeeeee 77.7778%,
    transparent 0%
  ) !important;
  background-size: 100% 43.2rpx;
  position: relative !important;
}
.sk-text-0-0000-519 {
  background-image: linear-gradient(
    transparent 0%,
    #eeeeee 0%,
    #eeeeee 100%,
    transparent 0%
  ) !important;
  background-size: 100% 24rpx;
  position: relative !important;
}
.sk-text-0-0000-76 {
  background-image: linear-gradient(
    transparent 0%,
    #eeeeee 0%,
    #eeeeee 100%,
    transparent 0%
  ) !important;
  background-size: 100% 28rpx;
  position: relative !important;
}
.sk-text-14-2857-365 {
  background-image: linear-gradient(
    transparent 14.2857%,
    #eeeeee 0%,
    #eeeeee 85.7143%,
    transparent 0%
  ) !important;
  background-size: 100% 36.4rpx;
  position: relative !important;
}
.sk-text-14-2857-89 {
  background-image: linear-gradient(
    transparent 14.2857%,
    #eeeeee 0%,
    #eeeeee 85.7143%,
    transparent 0%
  ) !important;
  background-size: 100% 39.2rpx;
  position: relative !important;
}
.sk-text-14-2857-549 {
  background-image: linear-gradient(
    transparent 14.2857%,
    #eeeeee 0%,
    #eeeeee 85.7143%,
    transparent 0%
  ) !important;
  background-size: 100% 39.2rpx;
  position: relative !important;
}
.sk-text-14-2857-765 {
  background-image: linear-gradient(
    transparent 14.2857%,
    #eeeeee 0%,
    #eeeeee 85.7143%,
    transparent 0%
  ) !important;
  background-size: 100% 36.4rpx;
  position: relative !important;
}
.sk-text-22-2222-349 {
  background-image: linear-gradient(
    transparent 22.2222%,
    #eeeeee 0%,
    #eeeeee 77.7778%,
    transparent 0%
  ) !important;
  background-size: 100% 43.2rpx;
  position: relative !important;
}
.sk-image {
  background: #efefef !important;
}
.sk-container {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background-color: transparent;
}
</style>
